<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网站首页</title>
    <link rel="stylesheet" href="car_style.css">
    <link rel="stylesheet" href="nav_style.css">
    <link rel="stylesheet" href="show.css">
    <style>
        .header,
        .container,
        .footer{
            float: left;
            width: 100%;
            box-sizing: border-box;
        }

        .header{
            background: #dbeaf6;
            padding: 20px;
            text-align: center;
        }

        .lside{
            width: 20%;
            float: left;
        }

        .rside{
            width: 20%;
            float: right;
        }

        .content{
            margin: 10px 20% 20%;
        }

        .lside,
        .rside,
        .content{
            padding: 5px;
            box-sizing: border-box;
            line-height: 25px;
        }

        .footer{
            padding: 10px;
            background: #000139;
            text-align: center;
            color: #dbeaf6;
        }
    </style>
</head>

<body>
    <script src="nav.js"></script>
    <!-- <h1 style="text-align: center;font-family: SimSun; ">青岛旅游</h1>
    <br>
    <h3 style="text-align: center;">青岛旅游网欢迎您</h3>
    <div class="nav">
        <ul class="ullist">
            <li class="libt">
                <a href="shouye.html">网站首页</a>
            </li>

            <li class="libt">
                <a href="#">景点</a>
                <ul class="droplist">
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                </ul>
            </li>

            <li class="libt">
                <a href="hotel.html">酒店</a>
                <ul class="droplist">
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                </ul>
            </li>

            <li class="libt">
                <a href="#">路线</a>
                <ul class="droplist">
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉1</a></li>
                </ul>
            </li>

            <li class="libt">
                <a href="#">搜索</a>
            </li>

            <li class="libt">
                <a href="#">个人中心</a>
            </li>

            <li class="libt">
                <a href="#">注册登录</a>
            </li>

            <li class="libt">
                <a href="#">关于我们</a>
            </li>
        </ul>
    </div> -->

    <div class="carousel">
        <div class="container">
            <img src="carousel1.jpg">
            <img src="carousel2.jpg">
            <img src="carousel3.jpg">
        </div>
        <div class="shift left" onclick="shiftImage(-1)">&lt;</div>
        <div class="shift right" onclick="shiftImage(1)">&gt;</div>
    </div>
    <script src="car_script.js"></script>

    <div class="container">
        <div class="lside">
            <h3>海风浪漫</h3>
            <p>
                <img src="侧边.jpg" alt="" style="width: 100%;height:1200px">
            </p>
        </div>

        <div class="rside">
            <h3>岛韵悠长</h3>
            <p>
                <img src="侧边.jpg" alt="" style="width: 100%;height:1200px">
            </p>
        </div>
        <div class="content">
            <p>青岛，这座美丽的海滨城市，坐落于山东半岛的东南部，以其独特的魅力吸引着无数游客的目光。在这里，蓝天与碧海交相辉映，历史与现代和谐共存，让人流连忘返。
                <br><br>这里的气候宜人，四季分明，尤其是夏季，凉爽的海风轻轻吹过，为这座城市带来了无尽的惬意。漫步在青岛的街头巷尾，你会被那独特的建筑风格所吸引。红瓦绿树、碧海蓝天，构成了青岛独有的城市风貌。
                <br><br>青岛的海洋文化独具魅力。作为一座海滨城市，青岛拥有着得天独厚的海洋资源。从栈桥到八大关，从海底世界到海滨浴场，每一处都散发着海洋的气息。站在栈桥上，你可以欣赏到波澜壮阔的海景，感受到海风的轻拂；在八大关漫步，你会被那些风格迥异的别墅所吸引，仿佛置身于欧洲的某个小镇；在海底世界，你可以近距离地观赏到各种海洋生物，感受海洋的神秘与奇妙；而在海滨浴场，你可以尽情地享受阳光、沙滩和海浪带来的欢乐。
                <br><br>青岛的历史文化底蕴深厚。漫步在青岛的老城区，你会被那些充满异国风情的建筑所吸引。那些红瓦屋顶、尖顶钟楼、精致雕花的建筑，仿佛在诉说着一段段历史的故事。而青岛的啤酒文化更是独具特色。青岛啤酒以其独特的口感和品质，赢得了国内外消费者的喜爱。在青岛，你可以品尝到最新鲜的啤酒，感受那种独特的口感和风味。
                <br><br>青岛的人民热情好客。他们用自己的勤劳和智慧，创造了一个又一个的奇迹。青岛的经济发展迅速，人民生活水平不断提高。在这里，你可以感受到那种浓厚的城市氛围和人民的热情。无论是街头巷尾的小吃摊，还是高档餐厅的精致菜肴，都能让你感受到青岛人民的热情好客和独特的饮食文化。
                <br><br>青岛的旅游资源丰富多样。除了美丽的海滨风光和独特的建筑风格外，这里还有许多值得一游的景点。如崂山风景区、青岛森林野生动物世界、青岛奥帆中心等。在崂山风景区，你可以欣赏到壮丽的自然风光和丰富的文化底蕴；在青岛森林野生动物世界，你可以近距离地观赏到各种珍稀动物，感受大自然的神奇与美妙；而在青岛奥帆中心，你可以感受到那种拼搏进取的奥运精神。
                <br><br>总之，青岛是一座充满魅力的海滨城市。这里有美丽的自然风光、独特的建筑风格、深厚的历史文化底蕴和热情好客的人民。在这里，你可以感受到无尽的惬意和欢乐。无论你是来旅游观光，还是来品味美食，青岛都会给你留下深刻的印象和美好的回忆。
            </p>
            <br>
            <table>
                <tr>
                    <td colspan="3" class="showtitle"><h2>景点</h2></td>
                </tr>
                <tr>
                    <td colspan="3"><br></td>
                </tr>
                <tr>
                    <td><a href="景点1.jpg"><img src="景点1.jpg" class="showimg">
                        <span class="img_title">八大关</span></a></td>
                    <td><a href="景点2.jpg"><img src="景点2.jpg" class="showimg">
                        <span class="img_title">栈桥</span></a></td>
                    <td><a href="景点3.jpg"><img src="景点3.jpg" class="showimg">
                        <span class="img_title">小麦岛</span></a></td>
                </tr>
                <tr>
                    <td colspan="3"><br><hr><br></td>
                </tr>
                <tr>
                    <td colspan="3" class="showtitle"><h2>酒店</h2></td>
                </tr>
                <tr>
                    <td colspan="3"><br></td>
                </tr>
                <tr>
                    <td><a href="lun1.jpg"><img src="香格里拉1.png" class="showimg">
                        <span class="img_title">市南区</span></a></td>
                    <td><a href="lun1.jpg"><img src="香格里拉2.png" class="showimg">
                        <span class="img_title">市北区</span></a></td>
                    <td><a href="lun1.jpg"><img src="香格里拉3.png" class="showimg">
                        <span class="img_title">崂山区</span></a></td>
                </tr>
                <tr>
                    <td colspan="3"><br><hr><br></td>
                </tr>
              
            </table>
        </div>
    </div>
    <div class="footer">
        <p>底部</p>
        </div>
</body>
</html>